<template>
	<div class="hottest-ranking">
		<panel :title_key="title_key">
			<div slot="content" class="hottest-ranking_content"><content-ranking :data="content" v-if="content.length > 0"></content-ranking></div>
		</panel>
	</div>
</template>

<script>
import Panel from '@/components/panel';
import ContentRanking from '@/components/content-ranking/index';
export default {
	components: { Panel, ContentRanking },
	data() {
		return {
			title_key: 'hottest_ranking',
			content: []
		};
	},
	created() {
		this.initData();
	},
	methods: {
		initData() {
			this.$api.ranking.getHottestList().then(res => {
				this.content = res.data
			})
		}
	}
};
</script>

<style lang="scss" scoped>
.hottest-ranking {
	&_content {
		padding: 5px 20px;
	}
}
</style>
